<template>
  <div>
    <div class="main-div">
      <div class="main-div-info1" v-if="isMainModular1">
        <span>咖啡，是用经过烘焙磨粉的咖啡豆制作出来的饮料。</span><br>
        <span>作为世界三大饮料之一，其与可可、茶同为流行于世界的主要饮品</span>
      </div>
      <div class="main-div-info2" v-if="isMainModular1">
        <span>&nbsp;&nbsp;&nbsp;Coffee</span><br>
        <span>&nbsp;&nbsp;&nbsp;Kaweh</span><br>
        <span>力量与热情</span>
      </div>
    </div>
    <hr class="main-div-hr">
  </div>
</template>

<script>
export default {
  props:{
    isMainModular1:{
      type:Boolean,
      required:true
    }
  }

}
</script>

<style lang="less" scope>
.main-div{
  text-align: left;
  line-height : 60px;
  font-size: 18px;
  padding: 60px;

  height: 120px;
}

.main-div-hr{
  margin-left:2.5%;
  width: 95%;
}

@keyframes main-div-info1{
  from{margin-top: 1.5%;}
  to{margin-top: 0%;}
}

.main-div-info1{
  margin-top: 0%;
  animation:main-div-info1 0.8s;
}

.main-div-info2{
  margin-left: 90%;
  margin-top: -8%;
  margin-bottom: 0px;
  font-size: 20px;
}
</style>